<template>
	<view>
		<view class="viedo_list">
			<view class="vedio_item" v-for="item in videoData" :key="item.id">
				<image :src="item.videoCover" mode="scaleToFill" @click="gotToVideoDetial(item.id)" />
				<view class="name">
					<text class="vedio_name" @click="gotToVideoDetial(item.id)">{{ item.videoName }}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import {
	loadMediaByTag,
	loadMediaByType
} from '@/api/media/media'

import {
	getDetail
} from '@/api/back/md-common-back'
export default {
	data() {
		return {
			// 查询条件
			loadData: {
				id: undefined,
				loadCount: 12
			},
			videoData: undefined,
			// 通用详情/删除条件
			commonForm: {
				id: undefined,
				idList: [],
				tableName: undefined
			},
			// 上个页面跳转参数
			optionData: undefined
		}
	},

	// 下拉刷新
	onPullDownRefresh() {
		console.log('refresh');
		this.dealLoad()
		setTimeout(function () {
			uni.stopPullDownRefresh();
		}, 1000);
	},

	onReachBottom() {
		// console.log('页面触底');
		this.loadData.loadCount += 2
		// 查询数据
		this.dealLoad()
	},

	onLoad: function (option) {
		this.optionData = option
		this.dealLoad()
	},

	methods: {
		// 处理数据加载
		dealLoad() {
			const typeId = this.optionData.typeId
			if (typeId) {
				this.loadData.id = typeId
				this.handleLoadMediaByType()

				this.commonForm.id = typeId
				this.commonForm.tableName = 'ad_media_type'
				this.setNavigationBarTitle()
			}

			const tagetId = this.optionData.tagetId
			if (tagetId) {
				this.loadData.id = tagetId
				this.handleLoadMediaByTag()

				this.commonForm.id = tagetId
				this.commonForm.tableName = 'ad_tag'
				this.setNavigationBarTitle()
			}
		},

		// 设置标题
		setNavigationBarTitle() {
			getDetail(this.commonForm).then(res => {
				const resData = res.data
				console.log('响应信息', resData);

				if (resData.tagName) {
					// 设置当前页面的导航栏标题
					uni.setNavigationBarTitle({
						title: resData.tagName
					});
				} else {
					this.title = resData.typeName
					// 设置当前页面的导航栏标题
					uni.setNavigationBarTitle({
						title: resData.typeName
					});
				}
			})
		},

		// 加载标签视频
		handleLoadMediaByTag() {
			loadMediaByTag(this.loadData).then(res => {
				this.videoData = res.data
			})
		},

		// 加载分类视频
		handleLoadMediaByType() {
			loadMediaByType(this.loadData).then(res => {
				this.videoData = res.data
			})
		},

		// 跳转播放
		gotToVideoDetial(id) {
			uni.navigateTo({
				url: '/pages/video/video?id=' + id
			});
		},
	}

}
</script>

<style lang="scss">
.viedo_list {
	background-color: #eee;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

	.vedio_item {
		width: 355rpx;
		margin: 5px;
		// text-align: center;

		image {
			width: 100%;
			height: 120px;
		}

		.vedio_name {
			text-align: left;
		}
	}
}
</style>